console.log("js调试");

var items=document.getElementsByClassName("item");
var goPrevBtn=document.getElementById('goPre');
var goNextBtn=document.getElementById('goNext');

var points = document.getElementsByClassName('point')






var index=0;//表示第几张图片在展示

var clearActive = function(){
	for(var i=0; i<items.length; i++ ){
		items[i].className=' item '
	}

	for(var i=0; i<points.length; i++ ){
		points[i].className='point '
	}
}



var goIndex = function(){
	clearActive()
	items[index].className = "item active"
	points[index].className = "point active"
}


var goNext = function(){
	if(index<items.length-1){
		index++
	}else{
		index=0
	}
	goIndex()
}

var goPrev = function(){
	if(index>0){
		index--
	}else{
		index=items.length-1
	}
	goIndex()
}




goNextBtn.addEventListener('click',function(){
	goNext()
})

goPrevBtn.addEventListener('click',function(){
	goPrev()
})


for(var i=0; i<points.length; i++){
	points[i].addEventListener('click', function(){

		//getAttribute---获取标签属性，这里获取一个数	
		var pointIndex=this.getAttribute('data-index')
		index=pointIndex
		goIndex()
		time=0   //在点击了圆点之后将定时器的time设置为0
	})
}



//第二部分--图片自动轮播


var time=0;//定时器图片跳转参数



setInterval(function(){
	time++
	if(time == 20){
		goNext()
		time=0
	}

},100)

